<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@ taglib uri="http://www.extremecomponents.org" prefix="ec"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="includeCSSjs.jsp" />
	
	<script type="text/javascript">
	function onTableClick(	idSedeHasSeccion,
			idSeccion,
			nombreSeccion,
			idSede,
			nombreSede,
			cupoSeccionSede,idTurno) {
		
		$("#idSedeHasSeccion").val(idSedeHasSeccion);
		$("#cupoSeccionSede").val(cupoSeccionSede);
		$("#idTurno").val(idTurno);
		getSede(idSede,nombreSede);
		getSeccion(idSeccion,nombreSeccion);
		
		showEditBtn();
	}
	
	function showEditBtn() {
		$(".btnEditar").hide("fast");
		$(".btnAgregar").hide("slow");
		$(".btnEditar").show("slow");

	}

	function hiddenEditBtn() {
		$(".btnEditar").hide("fast");
		$(".btnAgregar").show("slow");
	}

	function getSede(idSede,nombreSede){
			$("#idSede").val(idSede);
			$("#nombreSede").val(nombreSede);
		}
	function getSeccion(idSeccion,nombreSeccion){
			$("#idSeccion").val(idSeccion);
			$("#nombreSeccion").val(nombreSeccion);
		}
	</script>
	
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Grados Catalog</title>
</head>
<body>

<div id="container">

<!-- Aqui va el menu -->
<jsp:include page="menu.jsp" />
<div id="content">


<form:form method="post" action="addVinSedeSeccion"
		commandName="VinSedeSeccion">
		
<h2 class="divTextoEncabezado">Sede Secciones</h2>
		<form:errors path="*" cssClass="errorblock" element="div" />

		<table>
			<form:hidden path="tbSede.idSede" id="idSede" />
			<form:hidden path="tbSeccion.idSeccion" id="idSeccion" />
			<form:hidden path="idSedeHasSeccion" id="idSedeHasSeccion" />						
			<tr>
				<td><form:label path="tbSeccion.nombreSeccion" class="text0">Nombre Seccion </form:label></td>
				<td><form:input path="tbSeccion.nombreSeccion" id="nombreSeccion" class="required inputTextFacturaAgregar"/><input type="buttom" id="buscar" name="buscar" class="inputBoton botonLupa" onclick="TINY.box.show({iframe:'<%request.getContextPath();%>findSeccion',boxid:'frameless',width:600,height:350,fixed:true,maskid:'bluemask',maskopacity:100})">        </td>
				<td><form:errors path="tbSeccion.nombreSeccion*" cssClass="error" /></td>
			</tr>
			<tr>
				<td><form:label path="tbSede.nombreSede" class="text0">Nombre Sede </form:label></td>
				<td><form:input path="tbSede.nombreSede" id="nombreSede" class="required inputTextFacturaAgregar"/><input type="buttom" id="buscar" name="buscar" class="inputBoton botonLupa" onclick="TINY.box.show({iframe:'<%request.getContextPath();%>findSede',boxid:'frameless',width:600,height:350,fixed:true,maskid:'bluemask',maskopacity:100})">        </td>
				<td><form:errors path="tbSede.nombreSede*" cssClass="error" /></td>
			</tr>
				<tr>
				<td> 
					<form:label class="text0" path="tbTurno">Turno</form:label>
				</td>
			<td>
				<form:select path="tbTurno.idTurno"  id="idTurno" class="required cmbFactura1">
			<form:options items="${turnoList}" itemValue="idTurno" itemLabel="nombreTurno" />
			</form:select>
				</td>
			</tr>	
			<tr>
				<td><form:label path="cupoSeccionSede" class="text0">Cupo </form:label></td>
				<td><form:input path="cupoSeccionSede" id="cupoSeccionSede" class="required inputTextFacturaAgregar"/></td>
				<td><form:errors path="cupoSeccionSede*" cssClass="error" /></td>
			</tr>	
		
		</table>
		<center>
				<div class='btnAgregar'>
					<input type=image src="resources/img/boton_agregar.png"
						width="95" height="30" class="inputBoton">
				</div>
				<div class="btnEditar" style="display: none;">
					<input type=image src="resources/img/boton_guardar.png"
						width="95" height="30" class="inputBoton"
						onclick="edit('VinSedeSeccion','editVinSedeSeccion')"> 
					<input type=image src="resources/img/btn_eliminar.png" width="95"
						height="30" class="inputBoton"
						onclick="edit('VinSedeSeccion','deleteVinSedeSeccion')"> 
					<input type=image src="resources/img/boton_agregar.png" width="95" 
						height="30"	class="inputBoton" 
						onclick="edit('VinSedeSeccion','showVinSedeSeccion')">
				</div>
			</center>
				
	</form:form>
	
	<!-- Extreme Table  -->
	<ec:table items="TbSedeHasSeccionList"
		action="${pageContext.request.contextPath}/showVinSedeSeccion"
		view="compact"
		imagePath="${pageContext.request.contextPath}/resources/images/compact/*.gif"
		rowsDisplayed="8" autoIncludeParameters="false" var="grado">
		
		

		<ec:row highlightRow="true" 
		onclick="onTableClick(	'${pageScope.grado.idSedeHasSeccion}',
								'${pageScope.grado.tbSeccion.idSeccion}',
								'${pageScope.grado.tbSeccion.nombreSeccion}',
								'${pageScope.grado.tbSede.idSede}',
								'${pageScope.grado.tbSede.nombreSede}',
								'${pageScope.grado.cupoSeccionSede}',
								'${pageScope.grado.tbTurno.idTurno}');"
			>
			<ec:column property="tbSeccion.nombreSeccion" title="Nombre Periodo" />
			<ec:column property="tbSede.nombreSede" title="Nombre Turno"/>			
		</ec:row>
	</ec:table>
	
	</div>


<div id="footer"><p>The escool project</p></div>
</div>
	
</body>
</html>